{{extend "selfdevpoll_layout.html"}}

{{block page_header}}
{{use "jqutils", ajaxForm=True}}
<style>
    div.page-header {position:relative;}
    #modules_admin {position:absolute;right:100px;bottom:4px;}
    #poll_admin {position:absolute;right:10px;bottom:4px;}
    table.poll th {text-align:center; background-color:#d9e8ff;border:none;}
    table.poll td {border:none;}
    table.poll td.award {text-align:center;}
    #user_info {margin:10px; margin-left:auto; margin-right:auto;}
    #user_info label{width:80px;}
    .form .input {margin-left:90px;}
    .form fieldset {
        margin-bottom: 18px;
        padding: 12px;
        border: 1px solid #ccc;
    }
    .form fieldset legend {
        display: block;
        font-size: 1em;
        font-weight: bold;
        line-height: 1;
        color: #404040;
        padding-left:2px;
        padding-right:2px;
    }
</style>
<h2>自主研发优秀模块投票<small>({{=poll.begin_date}}至{{=poll.end_date}})</small></h2>
{{if has_permission(request.user, 'SelfDevPollAdmin'):}}
<a id="modules_admin" href="/poll/selfdev/modules_admin" class="btn">模块管理</a>
<a id="poll_admin" href="/poll/selfdev/poll_admin" class="btn">投票管理</a>
{{pass}}
{{end}}

{{block content_main}}
{{use "bootstrap", plugins=['alerts'], use_less=True}}
{{use "poshytip"}}
{{include "inc_show_flashes.html"}}
<div class="span14">
{{from uliweb.utils import date}}
{{flag = False}}
{{if date.today()<poll.begin_date:}}
    {{def message():}}
    <p><big><b>投票将于{{=poll.begin_date}}开始，敬请等候！</b></big></p>
    {{pass}}
{{elif date.today()>poll.end_date:}}
    {{def message():}}
    <p><big><b>投票已经结束，请等待结果！</b></big></p>
    {{pass}}
{{else:}}
    {{flag = True}}
{{pass}}

{{if not flag:}}
<div class="alert-message error fade in">
  {{message()}}
</div>
{{pass}}

{{if flag:}}
<div class="alert-message warning fade in" data-alert="alert">
  <a class="close" href="#">&times;</a>
  <p><strong>投票规则说明：</strong><br/>
&raquo;<b>每个奖项必须且仅能选投5个模块。</b>正确投票后，需在页面下方录入投票人姓名、行内邮箱、所属部门、联系电话(可选)等信息，并选择“提交”；<br/>
&raquo;如果投票验证通过，将会向投票人录入的邮箱发送一封激活邮件，投票人在确认邮件反馈的投票内容并点击邮件中的链接后，投票生效；<br/>
&raquo;投票提交后，投票激活的有效时间是24小时以内，超过有效期未激活，投票将自动作废；<br/>
&raquo;在整个投票活动有效期范围内，投票人只能有一次有效投票机会。在投票未生效状态下，可以多次投票，以最后一次成功激活的为准；<br/>
&raquo;为了保证投票的合理公正，请只使用行内个人邮箱，部门及非个人邮箱将视为无效；<br/>
&raquo;点击投票页面中的模块名称，可以进入FLPM论坛中的该模块简介主题，作为员工投票的参考依据；<br/>
&raquo;如仅参与投票，员工可不在FLPM论坛注册；如需对各模块介绍的主题进行评论和回复，则需注册。
</p>
</div>

<p align="center"><a href="/poll/selfdev/details" class="btn info">投票明细查看(已投票张数为: <b>{{=count}}</b>，未激活投票数: <b>{{=un_enabled}}</b>)</a></p>

<form action="/poll/selfdev/poll" method="POST" id="poll_form" class="form">
<table id="selfdev" class="table zebra-striped poll">
    <thead>
        <tr>
            <th width="40px">序号</th>
            <th>参选模块</th>
        {{for (id, v) in settings.get_var('SELFDEVPOLL/awards'):}}
            <th id="award_{{=id}}">{{=v}}(<span title="剩余票数">5</span>)</th>
        {{pass}}
        </tr>
    </thead>
    <tbody>
        {{for i, obj in enumerate(objects):}}
            <tr>
                <td>{{=i+1}}</td>
                <td>{{if obj.link:}}<a href="{{=obj.link}}" title="点击查看模块介绍" target="_blank">{{=obj.name}} &raquo;</a>{{else:}}{{=obj.name}}{{pass}}</td>
                {{for (id, v) in settings.get_var('SELFDEVPOLL/awards'):}}
                    <td class="award"><input type="checkbox" name="selections" rel="{{=id}}" value="{{=obj.id}},{{=id}}"</td>
                {{pass}}
            </tr>
        {{pass}}
    </tbody>
</table>
<div id="user_info">
    <fieldset>
    <legend>投票人员信息</legend>
    <div class="row clearfix">
        <div class="span6">
            {{<< user_form.username.label}} 
            <div class="input">
                <input id="field_username" name="username" type="text" value="" class="span2">
            </div>
        </div>
        <div class="span6">
            {{<< user_form.email.label}} 
            <div class="input">
                {{<< user_form.email}}
            </div>
        </div>
    </div>
    <div class="row clearfix">
        <div class="span6">
            {{<< user_form.depart.label}} 
            <div class="input">
                {{<< user_form.depart}}
            </div>
        </div>
        <div class="span6">
            {{<< user_form.mobile.label}} 
            <div class="input">{{<< user_form.mobile}}</div>
        </div>
    </div>
    </fieldset>
    <div class="actions">
        <input type="submit" class="btn primary" value="提交结果">
        <button type="reset" class="btn">取消</button>
    </div>
</div>
</form>
</div><!-- span16 -->
<script>
    var success = function(data){
        window.location.href=data.url;
    }
    
    function check_valid(){
        var polls = [];
        var poll_names = [];
        {{for i, (id, v) in enumerate(settings.get_var('SELFDEVPOLL/awards')):}}
         polls[{{=i}}] = '{{=id}}';
         poll_names[{{=i}}] = '{{=v}}';
        {{pass}}
        var num;
        for(var i=0; i<polls.length; i++){
            num = $('input[rel='+polls[i]+']:checked').size();
            if (num != 5){
                show_message(poll_names[i] + '投票数必须是5张！');
                return false;
            }
        }
        return true;
    }
    
    $('#poll_form').delegate('input[type=checkbox]', 'click', function(){
        var el = $(this);
        var _id = el.attr('rel');
        var step;
        if (el.attr('checked')) step = -1;
        else step = 1;
        var span = $('#award_'+_id + ' span');
        span.html(parseInt(span.html()) + step);
    });
    
    $(function(){
        //设置poshytip关闭图片
        $.fn.poshytip.defaults.closeImage = '{{=url_for_static("jqutils/cross_grey_small.png")}}';
        
        //生成ajaxForm的处理函数 create_result_process defined in jqutils.js
        var result_process = create_result_process('#poll_form', 
            {success:success});
        
        //设置ajaxForm的参数
        var options = { 
            success: result_process,  // post-submit callback 
            dataType: 'json',
            beforeSubmit: check_valid
        }; 
        // bind form using 'ajaxForm' 
        $('#poll_form').ajaxForm(options); 
        
        //在发出ajax请求时清除存在的消息信息
        $(document).ajaxStart(function(){
            show_simple_message('');
        });
        
    });
</script>
{{pass}}
{{end}}